<template>
  <div style="margin-left: 10px;">
      <quarterly-picker v-model="value" @change="change">
      </quarterly-picker>
  </div>
</template>

<script>
export default {
  data() {
    return {
      value: [],
      item: {
        startTime: '',
        endTime: '',
        isRange: false
      }
    };
  },
  methods: {
    change(value) {
      this.item.startTime = value[0] + ' 00:00:00';
      this.item.endTime = value[1] + ' 23:59:59';
      this.$emit('change', this.item);
    }
  },
  created() {
    this.item = Object.assign(this.item, JSON.parse(JSON.stringify(this.$attrs)));
    const startTime = this.$moment().startOf('quarter').format('YYYY-MM-DD');
    const endTime = this.$moment().endOf('quarter').format('YYYY-MM-DD');
    this.item.startTime = this.item.startTime || startTime + ' 00:00:00';
    this.item.endTime = this.item.endTime || endTime + ' 23:59:59';
    this.value = [this.item.startTime.split(' ')[0], this.item.endTime.split(' ')[0]];
    this.$emit('change', this.item);
  }
};
</script>

<style>

</style>